<template>
  <div id="orderSearchDiv">
    <div id="dataViewDiv">
      <div>
        <el-radio-group v-model="dataViewDate" @change="queryTradeOrderTotal()">
          <el-radio-button label="1">今天</el-radio-button>
          <el-radio-button label="2">最近三天</el-radio-button>
          <el-radio-button label="3">最近七天</el-radio-button>
          <el-radio-button label="4" class="el-radio-button-inner-datepicker">
            <el-date-picker v-model="dataViewRange" type="daterange" align="right" unlink-panels range-separator="至"
              start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" :picker-options="pickerOptions"
              @focus="focusPickerDate" @blur="changeDataViewDate" @change="changeDataViewDate"></el-date-picker>
          </el-radio-button>
        </el-radio-group>
      </div>
      <div style="margin-top:20px;">
        <div id="order_total_flex">
          <div class="total_row_item">
            <div class="order_content">
              <div class="order_total_title">付款单（笔）</div>
              <div class="order_total_info">
                <span class="order_data">{{ totalData.payOrderNum }}</span>
              </div>
            </div>
            <div class="order_detail">
              <div class="order_content2">
                <div class="order_total_title">已完成</div>
                <div class="order_total_info">
                  <span class="order_data">{{ totalData.orderFinishNum }}</span>
                </div>
              </div>
              <div class="order_content2">
                <div class="order_total_title">待收货</div>
                <div class="order_total_info">
                  <span class="order_data">{{ totalData.orderAcceptNum }}</span>
                </div>
              </div>
              <div class="order_content2">
                <div class="order_total_title">待发货</div>
                <div class="order_total_info">
                  <span class="order_data">{{ totalData.orderPostNum }}</span>
                </div>
              </div>
            </div>
          </div>
          <div class="total_row_item">
            <div class="order_content">
              <div class="order_total_title">
                用户付款金额（元）
                <el-popover placement="top-start" width="200" trigger="hover" :content="getDatatime('消费者支付金额合计')">
                  <el-button slot="reference" @click.stop style="padding:0;border:0"><i
                      class="el-icon-question"></i></el-button>
                </el-popover>
              </div>
              <div class="order_total_info">
                <span class="order_data">{{ totalData.payMoney }}</span>
              </div>
            </div>
          </div>
          <template v-if="!activityPage">
            <div class="total_row_item">
              <div class="order_content">
                <div class="order_total_title">退款单（笔）</div>
                <div class="order_total_info">
                  <span class="order_data">{{ totalData.returnOrderNum }}</span>
                </div>
              </div>
            </div>
            <div class="total_row_item">
              <div class="order_content">
                <div class="order_total_title">
                  用户退款金额（元）
                  <el-popover placement="top-start" width="200" trigger="hover" :content="getDatatime('消费者退款金额合计')">
                    <el-button slot="reference" @click.stop style="padding:0;border:0"><i
                        class="el-icon-question"></i></el-button>
                  </el-popover>
                </div>
                <div class="order_total_info">
                  <span class="order_data">{{ totalData.returnMoney }}</span>
                </div>
              </div>
            </div>
          </template>
          <div class="total_row_item">
            <div class="order_content">
              <div class="order_total_title">
                用户成交金额（元）
                <el-popover placement="top-start" width="200" trigger="hover"
                  :content="getDatatime('消费者确认收货已完成订单金额合计')">
                  <el-button slot="reference" @click.stop style="padding:0;border:0"><i
                      class="el-icon-question"></i></el-button>
                </el-popover>
              </div>
              <div class="order_total_info">
                <!-- <span class="order_data">{{ totalData.dealMoney }}</span> -->
                <span class="order_data">{{ (totalData.payMoney - totalData.returnMoney).toFixed(2) }}</span>
              </div>
            </div>
          </div>
          <div class="line_line"></div>
          <div class="total_row_item">
            <div class="order_content">
              <div class="order_total_title">累计付款用户数（人）</div>
              <div class="order_total_info">
                <span class="order_data">{{ totalData.payerNums }}</span>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div id="form1" style="text-align:center;margin-top:30px;margin-left:35px;">
      <el-form :inline="true" :model="formInline" class="demo-form-inline" @keyup.enter.native="search()"
        id="orderSearchForm">
        <el-form-item label="　　订单编号">
          <br />
          <br />
          <el-input v-model="formInline.orderNo" placeholder style="margin-left:-70px;width:200px"></el-input>
        </el-form-item>
        <el-form-item label="　店铺授权码" style="margin-left:-40px">
          <br />
          <br />
          <el-input v-model="formInline.authCode" placeholder style="margin-left:-90px;width:200px"></el-input>
        </el-form-item>
        <el-form-item label="　会员手机号" style="margin-left:-70px">
          <br />
          <br />
          <el-input v-model="formInline.memberPhone" placeholder style="margin-left:-85px;width:200px"></el-input>
        </el-form-item>
        <el-form-item label="　　商品名称" style="margin-left:-70px">
          <br />
          <br />
          <el-input v-model="formInline.goodsName" placeholder style="margin-left:-80px;width:200px"></el-input>
        </el-form-item>
        <!-- <el-form-item label="　退货状态：">
          <el-select v-model="formInline.returnStatus" placeholder="请选择" clearable>
            <el-option v-for="(item,i) in returnStatusList"
              :key="i"
              :value="item.id"
              :label="item.name"
            ></el-option>
          </el-select>
                </el-form-item>-->

        <el-form-item label="　　店铺名称" style="margin-left:-65px">
          <br />
          <br />
          <el-input v-model="formInline.storeName" placeholder style="margin-left:-70px;width:200px"></el-input>
        </el-form-item>
        <br />

        <span v-show="isActive">
          <el-form-item label="　　店主姓名">
            <br />
            <br />
            <el-input v-model="formInline.shopOwnerName" placeholder style="margin-left:-70px;width:200px"></el-input>
          </el-form-item>
          <el-form-item label="　　大区名称" v-if="orgType == 1 || orgType == 2" style="margin-left:-60px">
            <br />
            <br />
            <el-input v-model="formInline.warzoneName" placeholder style="margin-left:-70px;width:200px"></el-input>
          </el-form-item>
          <el-form-item label="　　营销区域名称" v-if="orgType == 1 || orgType == 2 || orgType == 3" style="margin-left:-60px">
            <br />
            <br />
            <el-input v-model="formInline.baseName" placeholder style="margin-left:-105px;width:200px"></el-input>
          </el-form-item>

          <!--
        <el-form-item label="　　会员等级：">
          <el-select v-model="formInline.gradelevelId" placeholder="请选择" clearable>
            <el-option v-for="(send,i) in gradelevelOptions"
              :key="i"
              :value="send.uuid"
              :label="send.gradelevelName"
            ></el-option>
          </el-select>
        </el-form-item>
                -->
          <el-form-item label="　　会员姓名" style="margin-left:-85px">
            <br />
            <br />
            <el-input v-model="formInline.memberName" placeholder style="margin-left:-70px;width:200px"></el-input>
          </el-form-item>
          <el-form-item label="经销商公司名称" style="margin-left:-35px">
            <br />
            <br />
            <el-input v-model="formInline.companyName" placeholder style="margin-left:-115px;width:200px"></el-input>
          </el-form-item>
          <br />
          <el-form-item label="　　支付类型" style="margin-left:-5px">
            <br />
            <br />
            <el-select v-model="formInline.payMethod" placeholder="请选择" clearable style="margin-left:-70px">
              <el-option v-for="(item, i) in payMethodList" :key="i" :value="item.id" :label="item.name"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="　　配送方式" style="margin-left:-60px">
            <br />
            <br />
            <el-select v-model="formInline.deliveryMethod" placeholder="请选择" clearable style="margin-left:-70px">
              <el-option v-for="(item, i) in deliveryMethodList" :key="i" :value="item.id"
                :label="item.name"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="　　订单状态" style="margin-left:-55px">
            <br />
            <br />
            <el-select v-model="formInline.orderStatus" placeholder="请选择" clearable style="margin-left:-70px">
              <el-option v-for="(item, i) in orderStatusList" :key="i" :value="item.id" :label="item.name"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="下单日期" style="margin-left:-26px">
            <br />
            <br />
            <el-date-picker v-model="formInline.dateRange" style="margin-left:-70px;width:425px;" type="daterange"
              align="right" unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
              value-format="yyyy-MM-dd" :picker-options="pickerOptions"></el-date-picker>
          </el-form-item>
          <br />
          <el-form-item label="是否包含赠品" style="margin-left:20px">
            <br />
            <br />
            <el-select v-model="formInline.isGiftOrder" placeholder="请选择" clearable style="margin-left:-100px">
              <el-option label="是" value="1"></el-option>
              <el-option label="否" value="0"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="　　商品类型" style="margin-left:-80px">
            <br />
            <br />
            <el-select v-model="formInline.goodsStyle" placeholder="请选择" clearable style="margin-left:-80px">
              <el-option label="普通商品" value="1"></el-option>
              <el-option label="宴席商品" value="2"></el-option>
              <el-option label="生日专属商品" value="3"></el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="是否包含限购品" style="margin-left:-30px">
            <br />
            <br />
            <el-select v-model="formInline.isBuyLimit" placeholder="请选择" clearable style="margin-left:-110px">
              <el-option label="是" value="1"></el-option>
              <el-option label="否" value="0"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="是否包含宴席信息" style="margin-left:-80px">
            <br />
            <br />
            <el-select v-model="formInline.isFeastOrder" placeholder="请选择" clearable style="margin-left:-110px">
              <el-option label="是" value="1"></el-option>
              <el-option label="否" value="0"></el-option>
            </el-select>
          </el-form-item>
          <br />

          <el-form-item label="　　付款日期" style="margin-left:-10px">
            <br />
            <br />
            <el-date-picker v-model="formInline.payDateRange" type="daterange" align="right" unlink-panels
              range-separator="至" style="margin-left:-70px;width:425px;" start-placeholder="开始日期" end-placeholder="结束日期"
              value-format="yyyy-MM-dd" :picker-options="pickerOptions"></el-date-picker>
          </el-form-item>
          <el-form-item label="　　退款时间" style="margin-left:195px">
            <br />
            <br />
            <el-date-picker v-model="formInline.refundDate" type="daterange" align="right"
              style="margin-left:-95px;width:425px;" unlink-panels range-separator="至" start-placeholder="开始日期"
              end-placeholder="结束日期" value-format="yyyy-MM-dd" :picker-options="pickerOptions"></el-date-picker>
          </el-form-item>

          <br />

          <el-form-item label="　　发货日期" style="margin-left:-10px">
            <br />
            <br />
            <el-date-picker v-model="formInline.fhDateRange" type="daterange" align="right"
              style="margin-left:-70px;width:425px;" unlink-panels range-separator="至" start-placeholder="开始日期"
              end-placeholder="结束日期" value-format="yyyy-MM-dd" :picker-options="pickerOptions"></el-date-picker>
          </el-form-item>

          <el-form-item label="订单完成日期" style="margin-left:195px">
            <br />
            <br />
            <el-date-picker v-model="formInline.completeDate" style="margin-left:-95px;width:425px;" type="daterange"
              align="right" unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
              value-format="yyyy-MM-dd" :picker-options="pickerOptions"></el-date-picker>
          </el-form-item>
        </span>
        <div id="multiBtnDiv" style="display:block;text-align:right;margin:20px 0">
          <el-button @click="isActive = !isActive" type="primary" size="mini" v-if="!isActive">筛选条件展开</el-button>
          <el-button @click="isActive = !isActive" type="primary" size="mini" v-if="isActive">筛选条件折叠</el-button>
          <el-button type="primary" @click="search()" size="mini" icon="el-icon-search"
            :disabled="dindanflagone">查询</el-button>
          <el-button type="primary" @click="kong()" size="mini" icon="el-icon-delete">清空</el-button>
          <el-button type="success" @click="exportExcel()" size="mini" icon="el-icon-s-data"
            :loading="exportLoading">导出</el-button>
          <el-button type="primary" @click="showConfigTableDialog()" size="mini" icon="el-icon-setting"
            :loading="insertLoading">列表配置</el-button>
        </div>
      </el-form>
    </div>
    <div class="table1">
      <el-table id="rebateSetTable" ref="table1" key="table1" tooltip-effect="dark" v-loading="loading"
        :data="tableData" border :header-cell-style="{ background: '#eef1f6', color: '#606266' }"
        @sort-change="handleSort">
        <el-table-column type="index" label="序号" align="center" width="60"></el-table-column>
        <el-table-column v-if="luchaoActivityColName" :label="luchaoActivityColName" prop="activityBonus" align="center"></el-table-column>
        <el-table-column v-for="(item, index) in col" :key="`col_${index}`" :prop="dropCol[index].prop"
          :width="dropCol[index].width" :min-width="200" :label="item.label" :sortable="item.sortable" align="center">
          <template slot-scope="scope">
            <div v-if="dropCol[index].prop === 'picList'">
              <img :src="scope.row.picList[0]" v-if="scope.row.picList != null && scope.row.picList.length > 0"
                width="70" height="50" @click="showGoodsPicDialog(scope.row)" title="点击查看" />
              <span v-if="scope.row.picList != null && scope.row.picList.length > 1">…</span>
              <span v-if="
                scope.row.picList == null || scope.row.picList.length == 0
              ">无</span>
            </div>
            <div v-if="dropCol[index].prop === 'feastList'">
              <div v-if="
                scope.row.feastList != null && scope.row.feastList.length > 0
              ">
                <div v-for="feastItem in scope.row.feastList" :key="feastItem.uuid">
                  <div>{{ feastItem.feastDate }}</div>
                  <div>{{ feastItem.feastAddressDetail }}</div>
                </div>
              </div>
              <span v-if="
                scope.row.feastList == null || scope.row.feastList.length == 0
              ">无</span>
            </div>
            <div v-if="
              dropCol[index].prop != 'feastList' &&
              dropCol[index].prop != 'picList'
            ">
              {{ scope.row[dropCol[index].prop] }}
            </div>
          </template>
        </el-table-column>
        <el-table-column v-if="activityPage" label="现金券优惠金额" prop="cashCouponMoney" align="center"></el-table-column>
        <!--
                <el-table-column
                    prop="orderNo"
                    label="订单编号"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('orderNo')"
                ></el-table-column>
                <el-table-column
                    prop="goodsNames"
                    label="商品名称"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('goodsNames')"
                ></el-table-column>
                <el-table-column
                    prop="totalAmount"
                    label="商品数量"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('totalAmount')"
                ></el-table-column>
                <el-table-column
                    prop="haveBuyLimitName"
                    label="是否包含限购品"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('haveBuyLimitName')"
                ></el-table-column>
                <el-table-column
                    prop="haveGiftOrderName"
                    label="是否包含赠品"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('haveGiftOrderName')"
                ></el-table-column>
                <el-table-column
                    prop="memberName"
                    label="会员姓名"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('memberName')"
                ></el-table-column>
                <el-table-column
                    prop="nickName"
                    label="备注名称"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('nickName')"
                ></el-table-column>
                <el-table-column
                    prop="gradelevelName"
                    label="会员等级"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('gradelevelName')"
                ></el-table-column>
                <el-table-column
                    prop="memberPhone"
                    label="会员手机号"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('memberPhone')"
                ></el-table-column>
                <el-table-column
                    prop="warzoneName"
                    label="大区名称"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('warzoneName')"
                ></el-table-column>
                <el-table-column
                    prop="baseName"
                    label="营销区域名称"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('baseName')"
                ></el-table-column>
                <el-table-column
                    prop="storeName"
                    label="店铺名称"
                    align="left"
                    show-overflow-tooltip
                    v-if="isShow('storeName')"
                ></el-table-column>
                <el-table-column
                    prop="authCode"
                    label="店铺授权码"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('authCode')"
                ></el-table-column>
                <el-table-column
                    prop="storeAddress"
                    label="店铺地址"
                    align="left"
                    show-overflow-tooltip
                    v-if="isShow('storeAddress')"
                ></el-table-column>
                <el-table-column
                    prop="shopOwnerName"
                    label="店主姓名"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('shopOwnerName')"
                ></el-table-column>
                <el-table-column
                    prop="payMoney"
                    label="订单实付金额"
                    align="right"
                    :formatter="fixData"
                    v-if="isShow('payMoney')"
                ></el-table-column>
                <el-table-column
                    prop="orderTime"
                    label="下单时间"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('orderTime')"
                ></el-table-column>
                <el-table-column
                    prop="postPerson"
                    label="收货人姓名"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('postPerson')"
                ></el-table-column>
                <el-table-column
                    prop="postPersonTel"
                    label="收货人电话"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('postPersonTel')"
                ></el-table-column>
                <el-table-column
                    prop="postAddress"
                    label="收货地址"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('postAddress')"
                ></el-table-column>
                <el-table-column
                    prop="feastList"
                    label="宴席信息"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('feastList')"
                >
                    <template slot-scope="scope">
                        <div v-if="scope.row.feastList != null && scope.row.feastList.length > 0">
                            <div v-for="feastItem in scope.row.feastList" :key="feastItem.uuid">
                                <div>{{feastItem.feastDate}}</div>
                                <div>{{feastItem.feastAddressDetail}}</div>
                            </div>
                        </div>
                        <span
                            v-if="scope.row.feastList == null || scope.row.feastList.length == 0"
                        >无</span>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="payMethodName"
                    label="支付类型"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('payMethodName')"
                ></el-table-column>
                <el-table-column
                    prop="orderSourceName"
                    label="订单来源"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('orderSourceName')"
                ></el-table-column>
                <el-table-column
                    prop="orderStatusName"
                    label="订单状态"
                    align="center"
                    show-overflow-tooltip
                    v-if="isShow('orderStatusName')"
                ></el-table-column>
                -->
        <el-table-column label="操作" align="center" fixed="right" width="200">
          <template slot-scope="scope">
            <el-button size="mini" @click="showOrderDetail(scope.row)" type="text">查看</el-button>
            <el-button v-if="scope.row.orderStatus === 4" size="mini" @click="changeOrderStatus(scope.row)"
              type="text">改变订单状态</el-button>
            <el-button v-if="scope.row.orderStatus === 0" @click="syncOrder(scope.row)" type="text"
              size="mini">同步订单</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-form :inline="true" :model="formInline">
        <el-form-item style="margin-top: 0px;"></el-form-item>
      </el-form>
      <div class="block" style="margin-top:-22px">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :disabled="dindanflag"
          :page-sizes="[10, 20, 30, 50, 100, 150, 200]" :current-page="listQuery.current" :page-size="listQuery.size"
          layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
      </div>
    </div>

    <!--列表配置-->
    <el-dialog title="列表配置" :visible.sync="configTableDialogVisible" width="50%" @close="closeConfigTableDialog()">
      <div id="configTableDiv">
        <el-form :inline="true" :model="formInline2" class="demo-form-inline">
          <el-form-item label="选择列表字段：">
            <el-checkbox :indeterminate="formInline2.isIndeterminate" v-model="formInline2.isAll"
              style="margin-top:10px;" @change="isAllFieldChange">全选</el-checkbox>
          </el-form-item>
          <el-divider></el-divider>
          <el-checkbox-group v-model="userMenuShowFields" @change="isSingleFieldChange">
            <el-checkbox v-for="item in userMenuFieldList" :label="item.fieldCode" :key="item.fieldCode"
              style="margin:15px 10px;width:120px;">{{ item.fieldName }}</el-checkbox>
          </el-checkbox-group>
        </el-form>
        <el-row>
          <el-col :span="24" style="text-align: center;margin-top: 30px">
            <el-button type="info" @click="closeConfigTableDialog()" size="mini">取 消</el-button>
            <el-button type="primary" @click="insertUserFieldRelation()" size="mini">确 认</el-button>
          </el-col>
        </el-row>
      </div>
    </el-dialog>

    <!--商品图片弹窗-->
    <el-dialog title="商品图片" :visible.sync="goodsPicDialoVisible" width="31%">
      <div>
        <el-form :inline="true" class="demo-form-inline">
          <el-row>
            <el-col>
              <img v-for="(item, i) in picList" :key="i" :src="item" width="150" height="120" style="margin-left:10px"
                @click="handlePreview(item)" title="点击查看" />
            </el-col>
          </el-row>
        </el-form>
      </div>
    </el-dialog>

    <!--图片预览弹窗-->
    <el-dialog :visible.sync="dialogVisibleImg" size="tiny">
      <img width="100%" :src="dialogImageUrl" alt />
    </el-dialog>
  </div>
</template>

<script>
import Sortable from 'sortablejs';
import { getmemberrule } from '@/api/membergrade';
import collapse from '@/utils/collapse.js';
import {
  queryTradeOrderTotal,
  queryTradeOrderByParam,
  queryTradeOrderByParamNoPage,
  excelTradeOrderByParam,
  queryTradeOrderPayInfo,
  queryTradeOrderItemList,
  queryUserMenuFieldByParam,
  insertUserFieldRelation,
  onlinePayQuery,
  upOrderStatusByOrderId
} from '@/api/tradeOrderSearch';
import qs from 'qs';
import FileSaver from 'file-saver';
import XLSX from 'xlsx';

const curDateStr = function () {
  var curDate = new Date();
  var year = curDate.getFullYear();
  var month = curDate.getMonth() + 1;
  month = month > 9 ? month : '0' + month;
  var date = curDate.getDate();
  date = date > 9 ? date : '0' + date;
  return year + '-' + month + '-' + date;
};
export default {
  props: {
    isSelfSupport: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      logininfo: '',
      orgSeq: '',
      dindanflag: false,
      dindanflagone: false,
      orgType: '',
      loading: true,
      exportLoading: false,
      insertLoading: false,
      goodsPicDialoVisible: false,
      isActive: false,
      dialogVisibleImg: false,
      dialogImageUrl: '',
      picList: [],
      dataViewDate: '1',
      dataViewRange: '',
      totalData: {
        orderNum: 0,
        payOrderNum: 0,
        returnOrderNum: 0,
        orderFinishNum: 0,
        orderAcceptNum: 0,
        orderPostNum: 0,
        orderCancelNum: 0,
        payMoney: 0,
        returnMoney: 0,
        payerNum: 0,

        payerNums: 0,
        dealMoney: 0,
      },
      orderStatusList: [
        {
          id: '0',
          name: '待支付',
        },
        {
          id: '1',
          name: '待发货',
        },
        {
          id: '2',
          name: '待收货',
        },
        {
          id: '3',
          name: '已完成',
        },
        {
          id: '-1',
          name: '已退款',
        },
      ], //订单状态
      returnStatusList: [
        {
          id: '0',
          name: '正常单',
        },
        {
          id: '1',
          name: '被退货单',
        },
        {
          id: '2',
          name: '退货单',
        },
      ], //退货状态
      payMethodList: [
        {
          id: '0',
          name: '云店线下',
        },
        {
          id: '1',
          name: '线上支付',
        },
        {
          id: '2',
          name: 'pos线下支付',
        },
        {
          id: '3',
          name: '微信',
        },
        {
          id: '4',
          name: '支付宝',
        },
        {
          id: '5',
          name: '银行卡',
        },
      ],
      deliveryMethodList: [
        {
          id: '1',
          name: '门店自提',
        },
        {
          id: '2',
          name: '配送服务',
        },
        {
          id: '3',
          name: '快递服务',
        },
      ], //配送方式
      gradelevelOptions: [], //会员等级
      formInline: {
        sortList: [],
        orderNo: '',
        orderStatus: '',
        companyName: '',
        returnStatus: '',
        customizeStatus: '',
        dateRange: '',
        payDateRange: '',
        fhDateRange: '',
        completeDate: '',
        refundDate: '',
        shopId: '',
        storeName: '',
        shopOwnerName: '',
        warzoneId: '',
        warzoneName: '',
        baseId: '',
        baseName: '',
        gradelevelId: '',
        memberName: '',
        memberPhone: '',
        goodsName: '',
        payMethod: '',
        deliveryMethod: '',
        authCode: '',
        isBuyLimit: '',
        isGiftOrder: '',
        isFeastOrder: '',
        goodsStyle: '',
      },
      allCol: [],
      col: [],
      dropCol: [],
      expandRowKeys: [],
      tableData: [], //订单列表数据
      tableDataExcel: [], //导出数据
      payData: [], //支付列表数据
      itemData: [], //商品列表数据
      total: 0,
      listQuery: {
        current: 1,
        size: 100,
      },
      sort: '',
      order: '',
      configTableDialogVisible: false, //列表配置弹窗状态
      formInline2: {
        isIndeterminate: false, //是否半选中
        isAll: true, //是否全部显示,
        menuCode: 'normalOrderSearch',
      },
      userMenuFieldList: [], //全部列名列表
      userMenuAllFields: [], //全部的列名
      userMenuShowFields: [], //显示的列名
      userOldMenuShowFields: [], //原显示的列名
      pickerOptions: {
        shortcuts: [
          {
            text: '最近3天',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
              picker.$emit('pick', [start, end]);
            },
          },
          {
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            },
          },
          {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            },
          },
        ],
        /*
        onPick: ({ maxDate, minDate }) => {
          this.pickerMinDate = minDate.getTime()
          if (maxDate) {
            this.pickerMinDate = ''
          }
        },
        disabledDate: (time) => {
          if (this.pickerMinDate !== '') {
            const day30 = 30 * 24 * 3600 * 1000
            let maxTime = this.pickerMinDate + day30
            if (maxTime > new Date()) {
              maxTime = new Date()
            }
            return time.getTime() > maxTime
          }
          return time.getTime() > Date.now()
        }
        */
      },
      activityPage: false,
      luchaoActivityColName: '',
    };
  },
  components: {
    collapse,
  },
  mounted() {
    var nowDay = this.getNowDay();
    var beginDay = this.getMonthOneDay();
    this.formInline.dateRange = [beginDay, nowDay];

    this.logininfo = localStorage.getItem('logininfo');
    let orgJson = JSON.parse(this.logininfo);
    if (
      orgJson != null &&
      orgJson.orgList != null &&
      orgJson.orgList.length > 0
    ) {
      this.orgSeq = orgJson.orgList[0].orgSeq;
      this.orgType = orgJson.orgList[0].orgType;
    }
    if (this.orgType == 2) {
      //大区
      this.formInline.warzoneId = this.orgSeq;
    } else if (this.orgType == 3) {
      //营销区域
      this.formInline.baseId = this.orgSeq;
    } else if (this.orgType == 4) {
      //门店
      this.formInline.shopId = this.orgSeq;
    }
    this.queryUserMenuFieldByParam(); //加载列表配置字段
    this._getmemberinfo(); //加载等级

    var orderSearchParam = sessionStorage.getItem('orderSearchParam');
    var pageFrom = sessionStorage.getItem('pageFrom');
    if (orderSearchParam != null && pageFrom == 'normalOrderDetail') {
      orderSearchParam = JSON.parse(orderSearchParam);
      this.formInline = orderSearchParam.formInline;
      this.listQuery = orderSearchParam.listQuery;
      this.total = orderSearchParam.total;
    }

    if (this.$route.params.activityType == 3 || this.$route.params.activityType == 4) {
      this.activityPage = true
    }

    if (this.$route.params.activityType == 4) {
      this.luchaoActivityColName = this.$route.params.scoreName || ''
    }

    // 普通订单查询(携带手机号)
    if (this.$route.params.cellPhoneNo) {
      this.formInline.memberPhone = this.$route.params.cellPhoneNo
    }
    // 携带店铺授权码
    if (this.$route.params.authCode) {
      this.formInline.authCode = this.$route.params.authCode
    }

    sessionStorage.removeItem('orderSearchParam');
    sessionStorage.removeItem('pageFrom');
    this.queryTradeOrderTotal(); //加载看板头部信息
    this.queryTradeOrderByParam(); //加载订单列表
    document.body.ondrop = function (event) {
      event.preventDefault();
      event.stopPropagation();
    };
    // this.rowDrop()
    this.columnDrop();
  },
  filters: {
    numFilter(value) {
      let realVal = '';
      if (!isNaN(value) && value !== '') {
        // 截取当前数据到小数点后2位
        realVal = parseFloat(value).toFixed(2);
      } else {
        realVal = '--';
      }
      return realVal;
    },
  },
  methods: {
    /* 获取时间+提示*/
    getDatatime(str) {
      return this.dataViewDate == 1
        ? '今天' + str
        : this.dataViewDate == 2
          ? '最近三天' + str
          : this.dataViewDate == 3
            ? '最近七天' + str
            : this.dataViewRange != null && this.dataViewRange != ''
              ? this.dataViewRange[0] + '至' + this.dataViewRange[1] + str
              : str;
    },
    //拖拽列表
    columnDrop() {
      const wrapperTr = document.querySelector('.el-table__header-wrapper tr');
      this.sortable = Sortable.create(wrapperTr, {
        animation: 180,
        delay: 0,
        onEnd: (evt) => {
          const oldItem = this.dropCol[evt.oldIndex - 1];
          this.dropCol.splice(evt.oldIndex - 1, 1);
          this.dropCol.splice(evt.newIndex - 1, 0, oldItem);
        },
      });
    },
    getNowDay() {
      var date = new Date();
      var seperator1 = '-';
      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var strDate = date.getDate();
      if (month >= 1 && month <= 9) {
        month = '0' + month;
      }
      if (strDate >= 0 && strDate <= 9) {
        strDate = '0' + strDate;
      }
      var currentdate = year + seperator1 + month + seperator1 + strDate;
      return currentdate;
    },
    getMonthOneDay() {
      var date = new Date();
      var seperator1 = '-';
      var year = date.getFullYear();
      var month = date.getMonth() + 1;
      var strDate = '01';
      if (month >= 1 && month <= 9) {
        month = '0' + month;
      }
      var currentdate = year + seperator1 + month + seperator1 + strDate;
      return currentdate;
    },
    //客户等级获取
    _getmemberinfo() {
      let data = {
        size: 99,
        current: 1,
        condition: {},
        ascs: [],
        descs: [],
      };
      getmemberrule(data).then((res) => {
        this.gradelevelOptions = res.records;
      });
    },
    //点击空白日期初始化
    focusPickerDate() {
      this.dataViewRange = '';
    },
    //点击头部时间选择切换为日期状态
    changeDataViewDate() {
      this.dataViewDate = '4';
      this.queryTradeOrderTotal();
    },
    /*头部看板*/
    queryTradeOrderTotal() {
      let beginDate = '';
      let endDate = '';
      if (
        this.dataViewDate == '4' &&
        this.dataViewRange != null &&
        this.dataViewRange.length == 2
      ) {
        beginDate = this.dataViewRange[0];
        endDate = this.dataViewRange[1];
      } else {
        this.dataViewRange = '';
      }
      let data = {
        dataViewDate: this.dataViewDate,
        beginDate: beginDate,
        endDate: endDate,
        isReturn: 0, //退款订单为1，正常订单为0
        isCustomizeOrder: 0, //定制订单为1，普通订单为0
        shopId: this.formInline.shopId.trim(),
        warzoneId: this.formInline.warzoneId.trim(),
        baseId: this.formInline.baseId.trim(),
      };

      if (this.$route.params.activityType == 3) {
        data.activityId = this.$route.params.activityId
      }

      if (this.$route.params.activityType == 4) {
        data.activityBonusId = this.$route.params.activityId
      }

      this.isSelfSupport && (data.isSelfSupport = 1);

      queryTradeOrderTotal(data).then((res) => {
        if (res != null) {
          this.totalData.orderNum = res.result.orderNum;
          this.totalData.payOrderNum = res.result.orderNum;
          this.totalData.returnOrderNum = res.result.returnOrderNum;
          this.totalData.orderFinishNum = res.result.orderFinishNum;
          this.totalData.orderAcceptNum = res.result.orderAcceptNum;
          this.totalData.orderPostNum = res.result.orderPostNum;
          this.totalData.orderCancelNum = res.result.orderCancelNum;
          this.totalData.payMoney = res.result.payMoney.toFixed(2);
          this.totalData.returnMoney = res.result.returnMoney.toFixed(2);
          this.totalData.payerNum = res.result.allPayerNum;
          this.totalData.payerNums = res.result.payerNums;
          this.totalData.dealMoney = res.result.dealMoney.toFixed(2);
        }
      });
    },
    /*订单列表*/
    queryTradeOrderByParam() {
      if (
        this.formInline.dateRange == undefined ||
        this.formInline.dateRange == null ||
        this.formInline.dateRange.length <= 0
      ) {
        this.$message.error('请选择下单日期');
        return;
      }
      let beginDate = '';
      let endDate = '';
      if (
        this.formInline.dateRange != null &&
        this.formInline.dateRange.length == 2
      ) {
        beginDate = this.formInline.dateRange[0];
        endDate = this.formInline.dateRange[1];
      } else {
        this.formInline.dateRange = '';
      }
      let payBeginDate = '';
      let payEndDate = '';
      if (
        this.formInline.payDateRange != null &&
        this.formInline.payDateRange.length == 2
      ) {
        payBeginDate = this.formInline.payDateRange[0];
        payEndDate = this.formInline.payDateRange[1];
      } else {
        this.formInline.payDateRange = '';
      }
      let fhBeginDate = '';
      let fhEndDate = '';
      if (
        this.formInline.fhDateRange != null &&
        this.formInline.fhDateRange.length == 2
      ) {
        fhBeginDate = this.formInline.fhDateRange[0];
        fhEndDate = this.formInline.fhDateRange[1];
      } else {
        this.formInline.fhDateRange = '';
      }

      /*  退款时间  和  完成时间  */
      let refundBeginDate = '';
      let refundEndDate = '';
      if (
        this.formInline.refundDate != null &&
        this.formInline.refundDate.length == 2
      ) {
        this.formInline.orderStatus = '-1';
        refundBeginDate = this.formInline.refundDate[0];
        refundEndDate = this.formInline.refundDate[1];
      } else {
        this.formInline.refundDate = '';
      }

      let completeBeginDate = '';
      let completeEndDate = '';
      if (
        this.formInline.completeDate != null &&
        this.formInline.completeDate.length == 2
      ) {
        completeBeginDate = this.formInline.completeDate[0];
        completeEndDate = this.formInline.completeDate[1];
      } else {
        this.formInline.completeDate = '';
      }
      /*  end */

      let data = {
        current: this.listQuery.current,
        size: this.listQuery.size,
        condition: {
          sortList: this.formInline.sortList,
          isReturn: 0, //退款订单为1，正常订单为0
          isCustomizeOrder: 0, //定制订单为1，普通订单为0
          orderNo: this.formInline.orderNo.trim(),
          companyName: this.formInline.companyName.trim(),
          orderStatus: this.formInline.orderStatus,
          returnStatus: this.formInline.returnStatus,
          customizeStatus: this.formInline.customizeStatus,
          beginDate: beginDate,
          endDate: endDate,
          payBeginDate: payBeginDate,
          payEndDate: payEndDate,
          fhBeginDate: fhBeginDate,
          fhEndDate: fhEndDate,
          shopId: this.formInline.shopId.trim(),
          storeName: this.formInline.storeName.trim(),
          shopOwnerName: this.formInline.shopOwnerName.trim(),
          warzoneId: this.formInline.warzoneId.trim(),
          warzoneName: this.formInline.warzoneName.trim(),
          baseId: this.formInline.baseId.trim(),
          baseName: this.formInline.baseName.trim(),
          gradelevelId: this.formInline.gradelevelId,
          memberName: this.formInline.memberName.trim(),
          memberPhone: this.formInline.memberPhone.trim(),
          goodsName: this.formInline.goodsName.trim(),
          payMethod: this.formInline.payMethod,
          deliveryMethod: this.formInline.deliveryMethod,
          authCode: this.formInline.authCode.trim(),
          isBuyLimit: this.formInline.isBuyLimit,
          isGiftOrder: this.formInline.isGiftOrder,
          isFeastOrder: this.formInline.isFeastOrder,
          goodsStyle: this.formInline.goodsStyle,
          //2021-01-04 退款时间  订单完成时间  帅选参数增加
          refundBeginDate: refundBeginDate,
          refundEndDate: refundEndDate,
          completeBeginDate: completeBeginDate,
          completeEndDate: completeEndDate,
          /*  end */
        },
        ascs: [],
        descs: [],
      };

      if (this.$route.params.activityType == 3) {
        data.condition.activityId = this.$route.params.activityId
      }

      if (this.$route.params.activityType == 4) {
        data.condition.activityBonusId = this.$route.params.activityId
      }

      this.isSelfSupport && (data.condition.isSelfSupport = 1);

      queryTradeOrderByParam(data).then((res) => {
        this.dindanflag = false;
        this.dindanflagone = false;
        this.loading = false;
        this.tableData = res.records;
        this.total = res.total;
      });
    },
    handleSizeChange(val) {
      this.listQuery.size = val;

      this.queryTradeOrderByParam();
    },
    handleCurrentChange(val) {
      this.listQuery.current = val;
      this.dindanflag = true;
      this.queryTradeOrderByParam();
    },
    //查询
    search() {
      this.listQuery.current = 1;
      this.dindanflagone = true;
      this.queryTradeOrderByParam();
    },
    //清空
    kong() {
      this.formInline.sortList = [];
      this.formInline.orderNo = '';
      this.formInline.orderStatus = '';
      this.formInline.companyName = '';
      this.formInline.returnStatus = '';
      this.formInline.customizeStatus = '';
      this.formInline.dateRange = '';
      this.formInline.payDateRange = '';
      this.formInline.fhDateRange = '';
      this.formInline.completeDate = '';
      this.formInline.refundDate = '';
      this.formInline.storeName = '';
      this.formInline.shopOwnerName = '';
      this.formInline.warzoneName = '';
      this.formInline.baseName = '';
      this.formInline.gradelevelId = '';
      this.formInline.memberName = '';
      this.formInline.memberPhone = '';
      this.formInline.goodsName = '';
      this.formInline.payMethod = '';
      this.formInline.deliveryMethod = '';
      this.formInline.authCode = '';
      this.formInline.isBuyLimit = '';
      this.formInline.isGiftOrder = '';
      this.formInline.isFeastOrder = '';
      this.formInline.goodsStyle = '';
    },
    //全数据页面导出
    exportExcel1() {
      this.exportLoading = true;
      //获取数据
      let beginDate = '';
      let endDate = '';
      if (
        this.formInline.dateRange != null &&
        this.formInline.dateRange.length == 2
      ) {
        beginDate = this.formInline.dateRange[0];
        endDate = this.formInline.dateRange[1];
      } else {
        this.formInline.dateRange = '';
      }
      let payBeginDate = '';
      let payEndDate = '';
      if (
        this.formInline.payDateRange != null &&
        this.formInline.payDateRange.length == 2
      ) {
        payBeginDate = this.formInline.payDateRange[0];
        payEndDate = this.formInline.payDateRange[1];
      } else {
        this.formInline.payDateRange = '';
      }
      let fhBeginDate = '';
      let fhEndDate = '';
      if (
        this.formInline.fhDateRange != null &&
        this.formInline.fhDateRange.length == 2
      ) {
        fhBeginDate = this.formInline.fhDateRange[0];
        fhEndDate = this.formInline.fhDateRange[1];
      } else {
        this.formInline.fhDateRange = '';
      }

      /*  退款时间  和  完成时间  */
      let refundBeginDate = '';
      let refundEndDate = '';
      if (
        this.formInline.refundDate != null &&
        this.formInline.refundDate.length == 2
      ) {
        this.formInline.orderStatus = '-1';
        refundBeginDate = this.formInline.refundDate[0];
        refundEndDate = this.formInline.refundDate[1];
      } else {
        this.formInline.refundDate = '';
      }

      let completeBeginDate = '';
      let completeEndDate = '';
      if (
        this.formInline.completeDate != null &&
        this.formInline.completeDate.length == 2
      ) {
        completeBeginDate = this.formInline.completeDate[0];
        completeEndDate = this.formInline.completeDate[1];
      } else {
        this.formInline.completeDate = '';
      }
      /*  end */

      let data = {
        isReturn: 0, //退款订单为1，正常订单为0
        isCustomizeOrder: 0, //定制订单为1，普通订单为0
        orderNo: this.formInline.orderNo.trim(),
        orderStatus: this.formInline.orderStatus,
        companyName: this.formInline.companyName.trim(),
        returnStatus: this.formInline.returnStatus,
        customizeStatus: this.formInline.customizeStatus,
        beginDate: beginDate,
        endDate: endDate,
        payBeginDate: payBeginDate,
        payEndDate: payEndDate,
        fhBeginDate: fhBeginDate,
        fhEndDate: fhEndDate,
        shopId: this.formInline.shopId.trim(),
        storeName: this.formInline.storeName.trim(),
        shopOwnerName: this.formInline.shopOwnerName.trim(),
        warzoneId: this.formInline.warzoneId.trim(),
        warzoneName: this.formInline.warzoneName.trim(),
        baseId: this.formInline.baseId.trim(),
        baseName: this.formInline.baseName.trim(),
        gradelevelId: this.formInline.gradelevelId,
        memberName: this.formInline.memberName.trim(),
        memberPhone: this.formInline.memberPhone.trim(),
        goodsName: this.formInline.goodsName.trim(),
        payMethod: this.formInline.payMethod,
        deliveryMethod: this.formInline.deliveryMethod,
        authCode: this.formInline.authCode.trim(),
        isBuyLimit: this.formInline.isBuyLimit,
        isGiftOrder: this.formInline.isGiftOrder,
        isFeastOrder: this.formInline.isFeastOrder,
        goodsStyle: this.formInline.goodsStyle,
        //2021-01-04 退款时间  订单完成时间  帅选参数增加
        refundBeginDate: refundBeginDate,
        refundEndDate: refundEndDate,
        completeBeginDate: completeBeginDate,
        completeEndDate: completeEndDate,
        /*  end */
      };
      queryTradeOrderByParamNoPage(data).then((res) => {
        this.tableDataExcel = res.records;
        if (res.records == null || res.records.length == 0) {
          this.$message.error('数据为空无法导出!');
          this.exportLoading = false;
          return;
        } else {
          //要导出去的标题
          var arry = [
            [
              '订单编号',
              '商品名称',
              '商品数量',
              '是否包含限购品',
              '是否包含赠品',
              '会员姓名',
              '备注名称',
              '会员等级',
              '会员手机号',
              '大区名称',
              '营销区域名称',
              '店铺名称',
              '店铺授权码',
              '店铺地址',
              '店主姓名',
              '订单实付金额',
              '下单时间',
              '收货人姓名',
              '收货人电话',
              '收货地址',
              '宴席信息',
              '支付类型',
              '订单来源',
              '订单状态',
            ],
          ];
          this.tableDataExcel
            .map((a, i) => {
              var _arry = [];
              _arry.push(a.orderNo == null ? '' : a.orderNo.toString());
              _arry.push(a.goodsNames == null ? '' : a.goodsNames.toString());
              _arry.push(a.totalAmount == null ? '' : a.totalAmount.toString());
              _arry.push(
                a.haveBuyLimitName == null ? '' : a.haveBuyLimitName.toString()
              );
              _arry.push(
                a.haveGiftOrderName == null
                  ? ''
                  : a.haveGiftOrderName.toString()
              );
              _arry.push(a.memberName == null ? '' : a.memberName.toString());
              _arry.push(a.nickName == null ? '' : a.nickName.toString());
              _arry.push(
                a.gradelevelName == null ? '' : a.gradelevelName.toString()
              );
              _arry.push(a.memberPhone == null ? '' : a.memberPhone.toString());
              _arry.push(a.warzoneName == null ? '' : a.warzoneName.toString());
              _arry.push(a.baseName == null ? '' : a.baseName.toString());
              _arry.push(a.storeName == null ? '' : a.storeName.toString());
              _arry.push(a.authCode == null ? '' : a.authCode.toString());
              _arry.push(
                a.storeAddress == null ? '' : a.storeAddress.toString()
              );
              _arry.push(
                a.shopOwnerName == null ? '' : a.shopOwnerName.toString()
              );
              _arry.push(
                a.receivedMoney == null ? 0.0 : a.receivedMoney.toFixed(2)
              );
              _arry.push(a.orderTime == null ? '' : a.orderTime.toString());
              _arry.push(a.postPerson == null ? '' : a.postPerson.toString());
              _arry.push(
                a.postPersonTel == null ? '' : a.postPersonTel.toString()
              );
              _arry.push(a.postAddress == null ? '' : a.postAddress.toString());
              let feastInfo = null;
              if (a.feastList != null && a.feastList.length > 0) {
                a.feastList.forEach((item, i) => {
                  if (i == 0) {
                    feastInfo =
                      item.feastDate + '\r\n' + item.feastAddressDetail;
                  } else {
                    feastInfo =
                      '\r\n' +
                      item.feastDate +
                      '\r\n' +
                      item.feastAddressDetail;
                  }
                });
              }
              _arry.push(feastInfo == null ? '无' : feastInfo);
              _arry.push(
                a.payMethodName == null ? '' : a.payMethodName.toString()
              );
              _arry.push(
                a.orderSourceName == null ? '' : a.orderSourceName.toString()
              );
              _arry.push(
                a.orderStatusName == null ? '' : a.orderStatusName.toString()
              );
              return _arry;
            })
            .forEach((a) => {
              arry.push(a);
            });
          var sheet = XLSX.utils.aoa_to_sheet(arry);
          sheet['!cols'] = [
            {
              wpx: 150, //订单编号
            },
            {
              wpx: 150, //商品名称
            },
            {
              wpx: 100, //商品数量
            },
            {
              wpx: 150, //是否包含限购品
            },
            {
              wpx: 150, //是否包含赠品
            },
            {
              wpx: 100, //会员姓名
            },
            {
              wpx: 100, //备注名称
            },
            {
              wpx: 120, //会员等级
            },
            {
              wpx: 120, //会员手机号
            },
            {
              wpx: 120, //大区名称
            },
            {
              wpx: 120, //营销区域名称
            },
            {
              wpx: 150, //店铺名称
            },
            {
              wpx: 150, //店铺授权码
            },
            {
              wpx: 150, //店铺地址
            },
            {
              wpx: 100, //店主姓名
            },
            {
              wpx: 120, //订单实付金额
            },
            {
              wpx: 180, //下单时间
            },
            {
              wpx: 100, //收货人姓名
            },
            {
              wpx: 150, //收货人电话
            },
            {
              wpx: 200, //收货地址
            },
            {
              wpx: 250, //宴席信息
            },
            {
              wpx: 150, //支付类型
            },
            {
              wpx: 150, //订单来源
            },
            {
              wpx: 150, //订单状态
            },
          ]; //单元格列宽
          this.exportLoading = false;
          this.openDownloadDialog(
            this.sheet2blob(sheet),
            new Date().toLocaleDateString() + '订单查询记录表.xlsx'
          );
        }
      });
    },
    //流导出
    exportExcel() {
      let beginDate = '';
      let endDate = '';
      if (
        this.formInline.dateRange != null &&
        this.formInline.dateRange.length == 2
      ) {
        beginDate = this.formInline.dateRange[0];
        endDate = this.formInline.dateRange[1];
      } else {
        this.formInline.dateRange = '';
      }
      let payBeginDate = '';
      let payEndDate = '';
      if (
        this.formInline.payDateRange != null &&
        this.formInline.payDateRange.length == 2
      ) {
        payBeginDate = this.formInline.payDateRange[0];
        payEndDate = this.formInline.payDateRange[1];
      } else {
        this.formInline.payDateRange = '';
      }
      let fhBeginDate = '';
      let fhEndDate = '';
      if (
        this.formInline.fhDateRange != null &&
        this.formInline.fhDateRange.length == 2
      ) {
        fhBeginDate = this.formInline.fhDateRange[0];
        fhEndDate = this.formInline.fhDateRange[1];
      } else {
        this.formInline.fhDateRange = '';
      }

      /*  退款时间  和  完成时间  */
      let refundBeginDate = '';
      let refundEndDate = '';
      if (
        this.formInline.refundDate != null &&
        this.formInline.refundDate.length == 2
      ) {
        this.formInline.orderStatus = '-1';
        refundBeginDate = this.formInline.refundDate[0];
        refundEndDate = this.formInline.refundDate[1];
      } else {
        this.formInline.refundDate = '';
      }

      let completeBeginDate = '';
      let completeEndDate = '';
      if (
        this.formInline.completeDate != null &&
        this.formInline.completeDate.length == 2
      ) {
        completeBeginDate = this.formInline.completeDate[0];
        completeEndDate = this.formInline.completeDate[1];
      } else {
        this.formInline.completeDate = '';
      }
      /*  end */

      let data = {
        sortList: this.formInline.sortList,
        isReturn: 0, //退款订单为1，正常订单为0
        isCustomizeOrder: 0, //定制订单为1，普通订单为0
        orderNo: this.formInline.orderNo.trim(),
        orderStatus: this.formInline.orderStatus,
        companyName: this.formInline.companyName.trim(),
        returnStatus: this.formInline.returnStatus,
        customizeStatus: this.formInline.customizeStatus,
        beginDate: beginDate,
        endDate: endDate,
        payBeginDate: payBeginDate,
        payEndDate: payEndDate,
        fhBeginDate: fhBeginDate,
        fhEndDate: fhEndDate,
        shopId: this.formInline.shopId.trim(),
        storeName: this.formInline.storeName.trim(),
        shopOwnerName: this.formInline.shopOwnerName.trim(),
        warzoneId: this.formInline.warzoneId.trim(),
        warzoneName: this.formInline.warzoneName.trim(),
        baseId: this.formInline.baseId.trim(),
        baseName: this.formInline.baseName.trim(),
        gradelevelId: this.formInline.gradelevelId,
        memberName: this.formInline.memberName.trim(),
        memberPhone: this.formInline.memberPhone.trim(),
        goodsName: this.formInline.goodsName.trim(),
        payMethod: this.formInline.payMethod,
        deliveryMethod: this.formInline.deliveryMethod,
        authCode: this.formInline.authCode.trim(),
        isBuyLimit: this.formInline.isBuyLimit,
        isGiftOrder: this.formInline.isGiftOrder,
        isFeastOrder: this.formInline.isFeastOrder,
        goodsStyle: this.formInline.goodsStyle,
        //2021-01-04 退款时间  订单完成时间  帅选参数增加
        refundBeginDate: refundBeginDate,
        refundEndDate: refundEndDate,
        completeBeginDate: completeBeginDate,
        completeEndDate: completeEndDate,
        /*  end */
      };

      if (this.$route.params.activityType == 3) {
        data.activityId = this.$route.params.activityId
      }

      if (this.$route.params.activityType == 4) {
        data.activityBonusId = this.$route.params.activityId
      }

      this.exportLoading = true;
      excelTradeOrderByParam(data).then((res) => {
        this.exportLoading = false;
        let blob = new Blob([res], { type: 'application/vnd.ms-excel' });
        const link = document.createElement('a');
        link.style = 'display:none';
        link.href = URL.createObjectURL(blob);
        link.download =
          new Date().toLocaleDateString() + '普通订单查询记录表.xlsx';
        document.body.appendChild(link);
        link.click();
      });
    },
    //导出excel（分页）
    exportExcel2() {
      /* generate workbook object from table */
      var head = document.querySelector(
        '#rebateSetTable div.el-table__header-wrapper'
      );
      var body = document.querySelector(
        '#rebateSetTable div.el-table__body-wrapper'
      );
      var all = document.createElement('div');
      all.appendChild(head.cloneNode(true));
      all.appendChild(body.cloneNode(true));
      let wb = XLSX.utils.table_to_book(all);
      /* get binary string as output */
      let wbout = XLSX.write(wb, {
        bookType: 'xlsx',
        bookSST: true,
        type: 'array',
      });
      try {
        FileSaver.saveAs(
          new Blob([wbout], { type: 'application/octet-stream' }),
          '普通订单列表.xlsx'
        );
      } catch (e) {
        if (typeof console !== 'undefined') console.log(e, wbout);
      }
      return wbout;
    },
    //数字格式化
    fixData(row, column, cellValue, index) {
      if (cellValue != null && !isNaN(cellValue)) {
        if (cellValue < 0) {
          return '0.00';
        } else {
          return cellValue.toFixed(2);
        }
      } else {
        return cellValue;
      }
    },
    //查看订单详情（跳转）
    showOrderDetail(v) {
      let orderSearchParam = {
        formInline: this.formInline,
        listQuery: this.listQuery,
        total: this.total,
      };
      sessionStorage.setItem('pageFrom', 'normalOrderSearch');
      sessionStorage.setItem(
        'orderSearchParam',
        JSON.stringify(orderSearchParam)
      );
      this.$router.push({
        name: 'normalOrderDetail',
        params: {
          edit: v,
        },
      });
    },
    //转下载文件
    sheet2blob(sheet, sheetName) {
      sheetName = sheetName || 'sheet1';
      var workbook = {
        SheetNames: [sheetName],
        Sheets: {},
      };
      workbook.Sheets[sheetName] = sheet;
      // 生成excel的配置项
      var wopts = {
        bookType: 'xlsx', // 要生成的文件类型
        bookSST: false, // 是否生成Shared String Table，官方解释是，如果开启生成速度会下降，但在低版本IOS设备上有更好的兼容性
        type: 'binary',
      };
      var wbout = XLSX.write(workbook, wopts);
      var blob = new Blob([s2ab(wbout)], { type: 'application/octet-stream' });
      // 字符串转ArrayBuffer
      function s2ab(s) {
        var buf = new ArrayBuffer(s.length);
        var view = new Uint8Array(buf);
        for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff;
        return buf;
      }
      return blob;
    },
    //下载文件触发弹窗
    openDownloadDialog(url, saveName) {
      if (typeof url == 'object' && url instanceof Blob) {
        url = URL.createObjectURL(url); // 创建blob地址
      }
      var aLink = document.createElement('a');
      aLink.href = url;
      aLink.download = saveName || ''; // HTML5新增的属性，指定保存文件名，可以不要后缀，注意，file:///模式下不会生效
      var event;
      if (window.MouseEvent) {
        event = new MouseEvent('click');
      } else {
        event = document.createEvent('MouseEvents');
        event.initMouseEvent(
          'click',
          true,
          false,
          window,
          0,
          0,
          0,
          0,
          0,
          false,
          false,
          false,
          false,
          0,
          null
        );
      }
      aLink.dispatchEvent(event);
    },
    //显示配置弹窗
    showConfigTableDialog() {
      this.userMenuShowFields = this.userOldMenuShowFields;
      let checkedCount = this.userMenuShowFields.length;
      this.formInline2.isAll = checkedCount === this.userMenuAllFields.length;
      this.formInline2.isIndeterminate =
        checkedCount > 0 && checkedCount < this.userMenuAllFields.length;
      this.configTableDialogVisible = true;
    },
    //关闭配置弹窗
    closeConfigTableDialog() {
      this.configTableDialogVisible = false;
      let data = {
        menuCode: this.formInline2.menuCode,
      };
    },
    queryUserMenuFieldByParam() {
      let data = {
        menuCode: this.formInline2.menuCode,
      };
      this.userMenuAllFields = []; //全部的列名
      this.userMenuShowFields = []; //显示的列名
      queryUserMenuFieldByParam(data).then((res) => {
        this.userMenuFieldList = res.records;
        this.userMenuFieldList.forEach((item, index) => {
          this.userMenuAllFields.push(item.fieldCode);
          if (item.isShow == 1) {
            this.userMenuShowFields.push(item.fieldCode);
          }
        });
        if (
          this.userMenuShowFields.length == 0 ||
          this.userMenuShowFields.length == this.userMenuAllFields.length
        ) {
          this.userMenuShowFields = this.userMenuAllFields;
          this.formInline2.isAll = true;
        } else {
          this.formInline2.isAll = false;
          this.formInline2.isIndeterminate = true;
        }
        this.insertUserFieldRelation(1);
      });
    },
    getNewCol() {
      let data = {
        menuCode: this.formInline2.menuCode,
      };
      this.col = [];
      this.dropCol = [];
      queryUserMenuFieldByParam(data).then((res) => {
        this.userMenuFieldList = res.records;
        this.userMenuFieldList.forEach((item, index) => {
          if (item.isShow == 1) {
            this.col.push({ label: item.fieldName, prop: item.fieldCode });
            this.dropCol.push({ label: item.fieldName, prop: item.fieldCode });
          }
        });
        if (this.col.length == 0) {
          this.col = this.allCol;
          this.dropCol = this.allCol;
          this.formInline2.isAll = true;
        }
        this.col.forEach((item, index) => {
          if (item.prop == 'totalAmount') {
            this.$set(item, 'sortable', 'totalAmount');
          } else if (item.prop == 'payMoney') {
            this.$set(item, 'sortable', 'payMoney');
          } else if (item.prop == 'orderTime') {
            this.$set(item, 'sortable', 'orderTime');
          }
        });
      });
    },
    //保存显示字段
    insertUserFieldRelation(isInit) {
      if (
        this.userMenuShowFields == null ||
        this.userMenuShowFields.length == 0
      ) {
        this.$message({
          showClose: true,
          message: '列表字段不可为空',
          type: 'info',
        });
        return;
      }
      let data = {
        menuCode: this.formInline2.menuCode,
        fieldList: this.userMenuShowFields,
      };
      if (isInit == 1) {
        insertUserFieldRelation(data).then((res) => {
          if (res.code == 1) {
            this.userOldMenuShowFields = this.userMenuShowFields;
            this.closeConfigTableDialog();
            this.getNewCol();
          }
        });
        return;
      }
      this.insertLoading = true;
      insertUserFieldRelation(data).then((res) => {
        this.insertLoading = false;
        if (res.code == 1) {
          this.$message({
            showClose: true,
            message: res.message,
            type: 'success',
          });
          this.userOldMenuShowFields = this.userMenuShowFields;
          this.closeConfigTableDialog();
          this.getNewCol();
        } else {
          this.$message({
            showClose: true,
            message: res.message,
            type: 'error',
          });
        }
      });
    },
    //是否全选字段
    isAllFieldChange(val) {
      this.userMenuShowFields = val ? this.userMenuAllFields : [];
      this.formInline2.isIndeterminate = false;
    },
    //是否选中单个字段
    isSingleFieldChange(val) {
      let checkedCount = this.userMenuShowFields.length;
      this.formInline2.isAll = checkedCount === this.userMenuAllFields.length;
      this.formInline2.isIndeterminate =
        checkedCount > 0 && checkedCount < this.userMenuAllFields.length;
    },
    //获取字段勾选状态
    getUserMenuFieldStatus(fieldCode) {
      if (this.userMenuShowFields != null) {
        for (let i = 0; i < this.userMenuShowFields.length; i++) {
          if (this.userMenuShowFields[i] == fieldCode) {
            return true;
          }
        }
        return false;
      }
    },
    //是否显示字段
    isShow(fieldCode) {
      if (this.formInline2.isAll || this.getUserMenuFieldStatus(fieldCode)) {
        return true;
      } else {
        return false;
      }
    },
    //显示上传弹窗
    showGoodsPicDialog(v) {
      this.picList = v.picList == null ? [] : v.picList;
      this.goodsPicDialoVisible = true;
    },
    //预览图片
    handlePreview(url) {
      this.dialogImageUrl = url;
      this.dialogVisibleImg = true;
    },
    handleSort(val) {
      let sortModel = '';
      if (val.order === 'ascending') {
        sortModel = 'ASC';
        if (val.prop == 'totalAmount') {
          this.formInline.sortList = [
            { sort: 'asc', sortField: 'totalAmount' },
          ];
          this.search();
        }
        if (val.prop == 'payMoney') {
          this.formInline.sortList = [{ sort: 'asc', sortField: 'payMoney' }];
          this.search();
        }
        if (val.prop == 'orderTime') {
          this.formInline.sortList = [{ sort: 'asc', sortField: 'orderTime' }];
          this.search();
        }
      } else if (val.order === 'descending') {
        sortModel = 'DESC';
        if (val.prop == 'totalAmount') {
          this.formInline.sortList = [
            { sort: 'desc', sortField: 'totalAmount' },
          ];
          this.search();
        }
        if (val.prop == 'payMoney') {
          this.formInline.sortList = [{ sort: 'desc', sortField: 'payMoney' }];
          this.search();
        }
        if (val.prop == 'orderTime') {
          this.formInline.sortList = [{ sort: 'desc', sortField: 'orderTime' }];
          this.search();
        }
      }
    },

    // 订单同步
    syncOrder(detail) {
      onlinePayQuery({
        orderId: detail.uuid,
        isSystemOperate: 1,
        orderPresaleType: 0,
      }).then((res) => {
        if (res.code) {
          this.$message.success(res.message);
          this.queryTradeOrderByParam();
        } else {
          this.$message.error(res.message);
        }
      });
    },

    // 改变订单状态
    changeOrderStatus(detail) {
      this.$confirm('确定改变订单状态吗?', '温馨提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        upOrderStatusByOrderId({
          orderId: detail.uuid,
        }).then((res) => {
          if (res.code == 1) {
            this.$message({
              type: 'success',
              message: res.message || '操作成功',
            })
            this.queryTradeOrderByParam();
          } else {
            this.$message({
              type: 'error',
              message: res.message || '操作失败',
            })
          }
        });
      });
    }
  },
  //其他
  computed: {},
};
</script>
<style scoped>
#orderSearchDiv /deep/ .el-radio-button-inner-datepicker .el-radio-button__inner {
  padding: 0;
}

#orderSearchDiv /deep/ .el-radio-button-inner-datepicker .el-input__inner {
  border: none;
  height: 38px;
}

#orderSearchDiv /deep/ #orderSearchForm {
  margin-left: -30px;
  padding: 0;
  display: inline-block;
  text-align: left;
}

#orderSearchDiv /deep/ .el-form--inline .el-form-item__content {
  width: 180px;
}

#orderSearchDiv /deep/ .el-range-editor.el-input__inner {
  width: 250px;
}

#orderSearchDiv /deep/ .el-dialog__body {
  padding-top: 0;
}

#order_total_flex {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-around;
}

#order_total_flex /deep/ .order_content {
  cursor: pointer;
  width: 200px;
  padding: 20px 0;
  margin: 0 auto;
  text-align: center;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}

#order_total_flex /deep/ .order_detail {
  width: 200px;
  margin-top: 10px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

#order_total_flex /deep/ .order_content2 {
  width: 60px;
  cursor: pointer;
  padding: 10px 0;
  margin: 0 1px;
  text-align: center;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
}

#order_total_flex /deep/ .order_content .order_total_title {
  color: #000;
}

#order_total_flex /deep/ .order_content .order_total_info {
  margin-top: 10px;
}

#order_total_flex /deep/ .order_content .order_data {
  font-size: 1.4em;
  font-weight: bold;
}

#configTableDiv /deep/ .el-divider--horizontal {
  margin-top: 0;
}

.line_line {
  border-left: 5px solid #dddddd;
  display: inline-block;
  height: 6.25rem;
  margin-left: -1px;
  padding: 0px 0px 0px 3px;
}
</style>
